<%
	DIRECTIVE SAFE_OUTPUT_OPEN;
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>找回密码</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<meta charset="utf-8" />
		<meta name="description" content="overview &amp; stats" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
		<%include("/WEB-INF/views/btl/template/include/header_level_first.html"){}%>
		<!-- HTML5shiv and Respond.js for IE8 to support HTML5 elements and media queries -->
		<!--[if lte IE 8]>
			<script src="${acePath}/assets/js/html5shiv.min.js"></script>
			<script src="${acePath}/assets/js/respond.min.js"></script>
		<![endif]-->
		<link rel="stylesheet" href="${ctx}/static/css/simple.css" />
		<link rel="stylesheet" href="${plugin}/form/jQuery-Validation-Engine/css/validationEngine.jquery.css" type="text/css"/>
		<link rel="stylesheet" href="${plugin}/form/jQuery-Validation-Engine/css/template.css" type="text/css"/>
		<link rel="stylesheet" href="${plugin}/tool/icheck/skins/square/blue.css" rel="stylesheet" />
		<link rel="stylesheet" href="${ctx}/static/fw/css/common.css"></script>
<style type="text/css">
.widget-box.visible {
    visibility: visible;
    position: relative;
    z-index: auto;
    -moz-transform: scale(1,1) translate(0);
    -webkit-transform: scale(1,1) translate(0);
    -o-transform: scale(1,1) translate(0);
    -ms-transform: scale(1,1) translate(0);
    transform: scale(1,1) translate(0);
    transition: transform .3s ease;
    -moz-transition: -moz-transform .3s ease;
    -webkit-transition: -webkit-transform .3s ease;
    -o-transition: -o-transform .2s ease;
}
.header {
    line-height: 28px;
    margin-bottom: 16px;
    margin-top: 18px;
    padding-bottom: 4px;
    border-bottom: 1px solid #CCC;
}
.input-icon.input-icon-right>.ace-icon {
    left: auto;
    right: 3px;
}
.input-icon {
    position: relative;
}
.block {
    display: block!important;
}
.input-icon>.ace-icon {
    padding: 0 3px;
    z-index: 2;
    position: absolute;
    top: 1px;
    bottom: 1px;
    left: 3px;
    line-height: 30px;
    display: inline-block;
    color: #909090;
    font-size: 16px;
}
</style>
<%include("/WEB-INF/views/btl/template/include/footer_level_first.html"){}%>
<script src="${plugin}/form/jQuery-Validation-Engine/js/languages/jquery.validationEngine-zh_CN.js"></script>
<script src="${plugin}/form/jQuery-Validation-Engine/js/jquery.validationEngine.js"></script>
<script src="${plugin}/form/jquery.form.js"></script>
<script src="${ctx}/static/fw/js/tag.value.control.js"></script>
<script src="${ctx}/static/fw/js/jquery.mailAutoComplete-3.1.js"></script>
<script src="${ctx}/static/js/retrievePassword.js"></script>
</head>
<body>
	 <nav class="navbar navbar-default navbar-fixed-top masthead">
      <div class="container">
        <div class="navbar-header">
          <a class="navbar-brand nav-item" href="#">${sys_systemName}</a>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
          <ul class="nav navbar-nav">
          </ul>
           <ul class="nav navbar-nav navbar-right">
           <%if(sys_register_open=="true"){%>
            <li><a title="注册账号" href="${ctx}/auth/toregister?${session._para}">注册</a></li>
           <%}%>
            <li><a href="${ctx}/auth/login?${session._para}">登录</a></li>
          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </nav>
    <div class="container content">
      <div class="jumbotron">
      <div class="findPwdTit">
				<span class="fm title">找回密码</span>
				<span class="r goLogin">已有帐号？<a href="${ctx}/auth/login?${session._para}">登录</a></span>
				<div class="clear"></div>
			</div>
           <div id="forgot-box" class="widget-box border center">
				<div class="widget-body content-box ">
		            <div id="showErrMsg" oper="${data.oper}"  val="${status}" class="hide alert alert-danger alert-dismissible" role="alert" id="errMsgContiner">
						  <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
						  <div>${desc}</div>
					</div>
					<div class="widget-main">
						<form id="selectStyleForm" class="form-horizontal" action="#" method="post">
							 <div class="col-xs-12 "  >
						  <div class="form-group  col-md-12">
						     <label class="required-before col-sm-3 control-label no-padding-right" for="name_text">找回方式：</label>
						      <div class="col-sm-9 inline-height">
						          <select name="findType" id="findType" class="form-item-control col-xs-10 validate[required,maxSize[20]]">
										<option value="03">已验证邮箱</option>
										<option value="02">已验证手机</option>
								  </select>
							   </div>
						  </div> 
						   <div class="form-group col-md-12">
							<label class="required-before col-sm-3 control-label no-padding-right" for="nationalId">账号：</label>
							<div class="col-sm-9 inline-height">
								<input type="text"  name="nationalId" placeholder="账号" class="col-xs-10 form-item-control validate[required,maxSize[20]]" />
						  	</div>
						  </div> 
						   <div class="form-group col-md-12">
						     <label class="required-before col-sm-3 control-label no-padding-right" for="birthday">验证码：</label>
						     <div class="col-sm-9 inline-height">
				     			<div style="width: 83.33333333%;float: left;">
				     			<div style="float: left;">
				     			<input type="text" name="captcha" class="form-item-control pull-left captcha" placeholder="验证码">
								</div>
								<img title="点击更换验证码"  class="pull-right captcha-img" id="randCodeImage"  src="${ctx}/auth/jcaptcha.jpg?w=99&h=31&${_para}" 
								onclick="this.src = '${ctx}/auth/jcaptcha.jpg?w=99&h=32&v=' + Math.random()+'&${_para}'" 
								 />
						 	 </div>
						 	  </div>
						  </div> 
						  </div>
							<div class="col-xs-12 clearfix center">
								<div class="mt30">
								<button type="button" id="next" class="width-120 btn btn-sm btn-primary">
									<i class="ace-icon fa fa-lightbulb-o"></i>
									<span class="bigger-110">下一步</span>
								</button>
							</div>
							</div>
						</form>
					</div><!-- /.widget-main -->
				</div><!-- /.widget-body -->
				<div class="widget-body content-box " style="display: none;">
		            <div id="showErrMsg" oper="${data.oper}"  val="${status}" class="hide alert alert-danger alert-dismissible" role="alert" id="errMsgContiner">
						  <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
						  <div>${desc}</div>
					</div>
					<div class="widget-main">
						<h4 class="header red lighter bigger">
							<i class="ace-icon fa fa-key"></i>
							找回密码
						</h4>
						<div class="space-6"></div>
						<div id="formDiv">
							<p>
								请输入您的注册邮箱
							</p>
							<form id="backPasswordForm" action="${ctx}/auth/retrieve/password" method="post"  onsubmit="return validate_form(this)">
								<fieldset>
									<label class="block clearfix">
										 <div class="parentCls divElem" style="display: inline; width: 100%" >
												<span class="block input-icon input-icon-right">
											    <input type="email" w="100%" style="padding-left: 6px;padding-right: 24px" class="form-control validate[required,maxSize[50],custom[email]] inputElem" name="email" placeholder="邮箱">
												<i class="ace-icon fa fa-envelope"></i>
											</span>
										 </div>
									</label>
								</fieldset>
							<div class="clearfix center">
								<div class="mt30">
								<button type="button" id="before" class="width-120 btn btn-sm btn-primary">
									<i class="ace-icon fa fa-lightbulb-o"></i>
									<span class="bigger-110">上一步</span>
								</button>
								<button type="submit" id="send" class="width-120 btn btn-sm btn-primary">
									<i class="ace-icon fa fa-lightbulb-o"></i>
									<span class="bigger-110">下一步</span>
								</button>
								</div>
							</div>
							</form>
						</div>
					</div><!-- /.widget-main -->
				</div><!-- /.widget-body -->
			</div><!-- /.forgot-box -->
      </div>
    </div><!-- /.container -->

     <footer class="footer">
      <div class="container center">
           <span class="bigger-120">
				Copyright &copy; ${copyright_year}
				<span class="blue bolder copyright">${copyright}</span>.
				All rights reserved. 
			</span>
      </div>
    </footer>
</body>
</html>